
<div class="layui-card layadmin-header">
  <div class="layui-breadcrumb" lay-filter="breadcrumb">
    <a lay-href="">主页</a>
    <a><cite>商户通道</cite></a>
  </div>
</div>

<div class="layui-fluid">
  <div class="layui-card">
    <div class="layui-tab layui-tab-brief">
      <ul class="layui-tab-title">
        <li class="layui-this">通道列表</li>
      </ul>
      <div class="layui-tab-content">
        <div class="layui-tab-item layui-show">
          <div class="layui-row">
            <div class="layui-form" style="float:right;">
              <div class="layui-form-item" style="margin:0;">
                <label class="layui-form-label">通道ID</label>
                <div class="layui-input-inline">
                  <input type="text" name="passageId" id="passageId" placeholder="通道ID" autocomplete="off" class="layui-input">
                </div>
                <label class="layui-form-label">商户ID</label>
                <div class="layui-input-inline">
                  <input type="text" name="mchId" id="mchId" placeholder="商户ID" autocomplete="off" class="layui-input">
                </div>
                <button id="search" class="layui-btn" data-type="reload">
                  <i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>
                </button>
              </div>
            </div>
          </div>
          <div class="layui-card-body">
            <div style="padding-bottom: 10px;">
              <button class="layui-btn layuiadmin-btn-list" data-type="add">添加</button>
            </div>
          </div>
          <table id="Pay_Mgr_Passage_dataAll" lay-filter="Pay_Mgr_Passage_dataAll"></table>
        </div>

      </div>
    </div>
  </div>
</div>

<script type="text/html" id="payBar">
  <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
</script>

<script>
  layui.use(['admin', 'table', 'util','form','layer'], function(){
    var $ = layui.$
      ,admin = layui.admin
      ,table = layui.table
      ,element = layui.element
        ,view =layui.view
        ,layer =layui.layer
      ,form = layui.form;

    element.render('breadcrumb', 'breadcrumb');

    var router = layui.router();
    var mchId = router.search.mchId;

    var tplStatus = function(d){
      if(d.state == 1) {
        return "<span class='layui-btn layui-btn-xs''>开启</span>";
      }
      return "<span class='layui-btn layui-btn-xs layui-btn-disabled'>关闭</span>";
    };

    //商户列表
    table.render({
      elem: '#Pay_Mgr_Passage_dataAll'
      ,url: layui.setter.baseUrl + '/mch_passage/list' //列表接口
      ,where: {
        mchId: mchId ,
        access_token: layui.data(layui.setter.tableName).access_token
      }
      ,id: 'tableReload'
      ,page: true
      ,cols: [[
        {type: 'checkbox', fixed: 'left'}
        ,{field: 'mchId', title: '商户ID'}
        ,{field: 'passageId', title: '通道ID'}
        ,{field: 'mchRate', title: '商户费率'}
        ,{field: 'state', title: '状态', templet: tplStatus}
        ,{field: 'createTime', title: '创建时间', width: 200, templet: '<div>{{ layui.util.toDateString(d.createTime, "yyyy-MM-dd HH:mm:ss") }}</div>'}
        ,{field: 'edit', title: '操作', width: 320, toolbar: '#payBar' }
      ]]
      ,skin: 'line'
    });

    //监听工具条
    table.on('tool(Pay_Mgr_Passage_dataAll)', function(obj){
      var data = obj.data;
      if(obj.event === 'edit'){

          var id = data.id;

          admin.req({
              type: 'get',
              url: layui.setter.baseUrl + '/mch_passage/get',
              data: {
                  id : id
              },
              error: function(err){
                  layer.alert(JSON.stringify(err.field), {
                      title: '错误提示'
                  })
              },
              success: function(res){
                  if(res.code == '0'){
                      // 2 赋值
                      data =res.data;

                      admin.popup({
                          title: '修改商户通道'
                          , area: ['400px', '400px']
                          , id: 'LAY-popup-content-edit'
                          , success: function (layero, index) {
                              view(this.id).render('merchant/passage/edit').done(function () {
                                  form.render(null, 'layuiadmin-app-form-list');
                                  var body =layer.getChildFrame('body',index);
                                  body.find('#email').val(data.email);
                                  form.val("layuiadmin-app-form-list", {
                                      "id" : data.id,
                                      "mchId" : data.mchId,
                                      "passageId" : data.passageId,
                                      "mchRate" : data.mchRate,
                                  })


                                  if(data.state == 1) {
                                      $("input[name='state'][value='1']").attr("checked",true);
                                  }else {
                                      $("input[name='state'][value='0']").attr("checked",true);
                                  }

                                  form.render();
                                  //
                                  form.on('submit(btnM)', function (data) {

                                      admin.req({
                                          type: "POST",
                                          url: layui.setter.baseUrl + '/mch_passage/update',
                                          data: data.field,
                                          error: function(err){layer.alert(err.msg,{title:"请求失败"})},
                                          success: function (res) {
                                              if (res.code == 0) {
                                                  /*layer.alert(res.msg,{title: "保存成功"},function(index){
                                                      table.reload('tableReload');
                                                      layer.closeAll();
                                                  })*/
                                                layer.msg('保存成功', {
                                                  offset: '15px'
                                                  ,icon: 1
                                                  ,time: 1000
                                                }, function(){
                                                  table.reload('tableReload');
                                                  layer.closeAll();
                                                });
                                              } else {
                                                 /* layer.alert(res.msg, {
                                                      title: '保存失败'
                                                  });*/
                                                layer.msg('保存失败', {
                                                  offset: '15px'
                                                  ,icon: 1
                                                  ,time: 1000
                                                });
                                              }
                                          }
                                      });
                                  });
                                  return false;
                              });
                          }
                      });
                  }
              }
          })

      }

    });

    // 搜索
    var $ = layui.$, active = {
      reload: function(){
        var mchId = $('#mchId').val();
        var appId = $("#appId").val();
        //执行重载
        table.reload('tableReload', {
          page: {
            curr: 1 //重新从第 1 页开始
          }
          ,where: {
            mchId: mchId,
            appId : appId
          }
        });
      }


        ,add: function (othis) {

            var router = layui.router();
            var mchId = router.search.mchId;
            admin.req({
                type: 'get',
                url: layui.setter.baseUrl + '/mch_passage/list_passage',
                data: {
                    mchId : mchId
                },
                error: function(err){
                    layer.alert(err, {
                        title: 'error'
                    })
                },
                success: function(res){
                    if(res.code == 0){
                        admin.popup({
                            title: '添加商户通道'
                            , area: ['400px', '400px']
                            , id: 'LAY-popup-content-edit'
                            , success: function (layero, index) {
                                view(this.id).render('merchant/passage/add').done(function () {
                                    console.log(mchId);
                                    form.val("layuiadmin-app-form-list", {
                                        "mchId" : mchId,

                                    })
                                    var str = "<select id='passageId' name='passageId' >";
                                    for (var i = 0; i < res.data.length; i++) {
                                        var d = res.data[i];
                                        str+="<option value='"+ d.id +"'>" + "[" + d.id + "] " + d.name + "</option>";
                                    }
                                    str += "</select>";
                                    $("#passageDiv").append(str);
                                    form.render('select');


                                    form.on('submit(mchPassageAdd)', function(data) {

                                        if(!data.field.passageId) {
                                            layer.alert("选择通道",{title: '提示'});
                                            return;
                                        }

                                        //这里可以写ajax方法提交表单
                                        admin.req({
                                            type: "POST",
                                            url: layui.setter.baseUrl + '/mch_passage/add',
                                            data: data.field,
                                            success: function(res){
                                                if(res.code == 0) {
                                                    /*layer.alert(res.msg,{title: "保存成功"},function(index){
                                                        table.reload('tableReload');
                                                        layer.closeAll();
                                                    })*/
                                                  layer.msg('保存成功', {
                                                    offset: '15px'
                                                    ,icon: 1
                                                    ,time: 1000
                                                  }, function(){
                                                    table.reload('tableReload');
                                                    layer.closeAll();
                                                  });
                                                }else {
                                                    /*layer.alert(res.msg, {
                                                        title: '保存失败'
                                                    });*/
                                                  layer.msg('保存失败', {
                                                    offset: '15px'
                                                    ,icon: 1
                                                    ,time: 1000
                                                  });
                                                }
                                            }
                                        });
                                        return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
                                    });

                                    form.render(null, 'layuiadmin-app-form-list');

                                });
                            }
                        });


                    }else {
                        layer.alert(res.msg,{title: '请求通道失败'})
                    }
                }
            });

        }
    };
    $('#search').on('click', function() {
      var type = $(this).data('type');
      active[type] ? active[type].call(this) : '';
    });
      $('.layui-btn.layuiadmin-btn-list').on('click', function () {
          var type = $(this).data('type');
          active[type] ? active[type].call(this) : '';
      });

    // 渲染表单
    form.render();
  });
</script>